<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>员工管理</title>

		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">

		<link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/font-awesome/4.6.0/css/font-awesome.min.css">

		<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

		<link rel="stylesheet" type="text/css" href="css/index.css" />

		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>

		<!--头部-->
		<link rel="stylesheet" type="text/css" href="js/bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/css/bootstrap.css" />
		<script src="js/bootstrap-3.3.7-dist/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
		<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
		<script src="js/colorpicker.js"></script>

	</head>

	<body>

		<div style="text-align:center;clear:both">
			<script src="/gg_bd_ad_720x90.js" type="text/javascript"></script>
			<script src="/follow.js" type="text/javascript"></script>
		</div>
		<!--头部-->
		<div id="abc">
			<h1>Staff Management</h1>
			<ul>

				<!--天气插件-->
				<li>
					<iframe width="210" scrolling="no" height="60" frameborder="0" allowtransparency="true" src="https://i.tianqi.com?c=code&id=12&icon=3&num=1&site=16"></iframe>
				</li>

				<li>

					<button class="btn glyphicon glyphicon-barcode" id="color-picker" name="picker">皮肤</button></li>
				<li><button class="btn glyphicon glyphicon-cloud-upload">上传</button></li>
				<li><button class="btn glyphicon glyphicon-envelope">通知</button></li>
				<li><button class="btn glyphicon glyphicon-cog">设置</button></li>
				<li><button class="btn glyphicon glyphicon-off">注销</button></li>

			</ul>

		</div>

	

		<iframe frameborder="0" scrolling="no" src="index3.html" width="400px" height="827px" ></iframe>
 

		<iframe frameborder="0"  src="welcome.html" width="78.55%" height="827" name="rightifrname"></iframe>



		
		
		
		
		
		
		
		
		
		
		
		
		<script>
			var list = document.querySelectorAll('.list');

			function accordion(e) {
				e.stopPropagation();
				if(this.classList.contains('active')) {
					this.classList.remove('active');
				} else
				if(this.parentElement.parentElement.classList.contains('active')) {
					this.classList.add('active');
				} else {
					for(i = 0; i < list.length; i++) {
						list[i].classList.remove('active');

					}
					this.classList.add('active');
				}
			}
			for(i = 0; i < list.length; i++) {
				list[i].addEventListener('click', accordion);
			}
		</script>

		<div style="text-align:center;clear:both;">
			<script src="/gg_bd_ad_720x90.js" type="text/javascript"></script>
			<script src="/follow.js" type="text/javascript"></script>
		</div>

		</div>
		</div>

	</body>

</html>
<!--头部-->
<script type="text/javascript">
	var obj = document.getElementById("picker");
	var a1 = Colorpicker.create({
		el: "color-picker",
		color: "#3F5D79",
		change: function(elem, hex) {
			abc.style.backgroundColor = hex;
		}
	})
</script>